<template>
  <div v-loading="loading" class="list-table noPad">
    <!-- latestDealCashFlowReportTab -->
    <el-tabs v-model="activeName" :type=" types === true ? 'border-card' : ''" @tab-click="clickMenu">
      <el-tab-pane v-for="(item, key) in childMenuTabs" :key="key" :lazy="true" :label="$t(item.menuName)" :name="item.menuName">
        <component :is="menuPath" v-if="item.flag" ref="menuPath" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import contractControlPanel from '@/views/deal/report/contractControlPanelType/contractControlPanel'
import { childMenuList } from '@/api/system/menu'
import { getAsyncComponent } from '@/utils'
export default {
  components: {
    contractControlPanel
  },
  props: {
    types: {
      type: Boolean,
      default: () => false
    }
  },
  data() {
    return {
      activeName: '',
      menuIdent: 'latest_deal_cashflow_report',
      // 加载
      loading: true,
      // 项目ID
      dealId: this.$route.query.id,
      // 子页签
      childMenuTabs: [],
      // 组件地址
      menuPath: '',
      // 参数
      parameter: {},
      panelType: ''
    }
  },
  mounted() {
    this.listLoad()
  },
  methods: {
    listLoad() {
      this.loading = true
      // 菜单列表
      childMenuList(this.menuIdent).then(response => {
        this.childMenuTabs = response.rows
        if (this.childMenuTabs !== null && this.childMenuTabs !== undefined && this.childMenuTabs.length > 0) {
          this.activeName = this.childMenuTabs[0] === undefined ? '' : this.childMenuTabs[0].menuName
          this.clickMenu(response.rows[0])
        } else {
          this.$router.push({ path: '@/view/error/404' })
        }
        this.loading = false
      })
    },
    clickMenu(tab) {
      this.childMenuTabs && this.childMenuTabs.forEach(item => {
        if (item.menuName === tab.menuName || item.menuName === tab.name) {
          this.$nextTick(() => {
            this.$set(item, 'flag', true)
            this.importFormPath(item.component)
          })
        } else {
          this.$set(item, 'flag', false)
        }
      })
    },
    // 引入组件
    importFormPath(menuPath) {
      if (menuPath) {
        if (menuPath.indexOf('?') === -1) { // 不含问号
          this.menuPath = getAsyncComponent('@/views/' + menuPath)
          this.parameter = {}
        } else {
          const index = menuPath.lastIndexOf('?')
          const sMenuPath = menuPath.substring(0, index)
          this.menuPath = getAsyncComponent('@/views/' + sMenuPath)

          // 增加参数
          const newKey = menuPath.split('?')[1]
          var newstr = newKey.replace(/=/g, '":"')
          const objectKey = '{"' + newstr.replace(/&/g, '","') + '"}'
          this.parameter = JSON.parse(objectKey)
          if (this.parameter !== undefined && this.parameter.dealType !== undefined) {
            this.panelType = this.parameter.dealType
          }
          console.log(this.panelType)
        }
        // 地址栏添加左侧菜单地址
        this.$nextTick(() => {
          this.$route.params.panelType = this.panelType
          this.$router.push({
            query: this.$route.query
          })
        })
      } else {
        const error = 'error/404'
        this.importFormPath(error)
      }
    }
  }
}
</script>
